@extends('layout.home.master')
@section('content')
    <div id="app" class="row mt-2">



        <div class="col-9">
            <div class="card card-body p-5">
                <div class="row">
                    <div class="col text-center">
                        <div class="col text-right">
                            @if($article->isFavorite(auth()->user()))
                                <a href="{{route('common.favorite.make',['model'=>'Article','id'=>$article->id])}}">
                                    <button class="btn btn-info"><span class="fe fe-thumbs-up "></span>
                                        取消收藏
                                    </button>
                                </a>
                            @else
                                <a href="{{route('common.favorite.make',['model'=>'Article','id'=>$article->id])}}">
                                    <button class="btn btn-info"><span class="fe fe-thumbs-up "></span>
                                        收藏
                                    </button>
                                </a>
                            @endif
                        </div>
                        <h2 class="mb-3">
                            {{$article->title}}
                        </h2>
                        <p class="card-text small text-muted">
                            <span class="fe fe-user "></span>{{$article->user->name}} .<span
                                    class="fe fe-clock "></span> {{$article->created_at->diffForHumans()}}
                        </p>
                    </div>
                </div> <!-- / .row -->
                <hr>
                <div class="content mt-3">
                    <div id="markdown">
                        文章内容:
                        {{--{{$article->content}}--}}
                        {!!$article['Markdown'] !!}
                    </div>

                    <hr>
                    <div class="text-center">
                        @if($article->isZan(auth()->user()))
                            <a href="{{route('common.zan.make',['model'=>'Article','id'=>$article->id])}}">
                                <button class="btn btn-info"><span class="fe fe-thumbs-up "></span>取消点赞</button>
                            </a>
                        @else
                            <a href="{{route('common.zan.make',['model'=>'Article','id'=>$article->id])}}">
                                <button class="btn btn-info"><span class="fe fe-thumbs-up "></span>点个赞呗</button>
                            </a>
                        @endif
                    </div>
                    <div>
                        <div class="avatar avatar-sm">
                            @foreach($article->zans()->with(['user'])->get() as$v)
                                <img src="{{$v->user->icon}}" alt="..." class="avatar-img rounded-circle">
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>

            @include('layout.common.comment',['model'=>$article])

        </div>





        <div class="col-sm-3">
            <div class="card">
                <div class="card-header">
                    {{$article->user->name}}
                </div>
                <div class="card-body text-center">
                    <div class="avatar avatar-xl">
                        <img src="{{$article->user->icon}}" alt="..." class="avatar-img rounded-circle">
                    </div>
                </div>
                <div class="card-footer">
                    @if(auth()->user()->attention($article->user))
                        <a href="{{route('home.user.attentions',[$article->user])}}">
                            <button class="btn btn-white btn-block"><span class="fe  "></span>取消关注</button>
                        </a>

                    @else
                        <a href="{{route('home.user.attentions',[$article->user])}}">
                            <button class="btn btn-white btn-block"><span class="fe fe-plus "></span>关注</button>
                        </a>

                    @endif
                </div>
            </div>

        </div>

    </div>
@endsection
@push('js')
    <script>
        require(['hdjs', 'marked', 'highlight'], function (hdjs, marked) {
            $(document).ready(function() {
                $('pre code').each(function(i, block) {
                    hljs.highlightBlock(block);
                });
            });
        })
    </script>
    @endpush
